import {Image, StyleSheet, View, Text, TouchableOpacity} from 'react-native';
import {Stack, useRouter} from "expo-router";
import { scaleSize } from "@/utils/screenSize"
import AntDesign from '@expo/vector-icons/AntDesign';
import { Ionicons } from '@expo/vector-icons';
import {useEffect} from "react";
import Textarea from "@/components/Textarea";

export default function settingScreen() {

    const router = useRouter();

    useEffect(() => {
        // goAbout();
        // goPrivacyAgreement();
    });

    const goAccount = () => {
        router.push("/setting/account");
    };

    const goNotice = () => {
        router.push("/setting/notice");
    };

    const goAbout = () => {
        router.push("/setting/about");
    };

    const goUserAgreement = () => {
        router.push("/setting/userAgreement");
    };

    const goPrivacyAgreement = () => {
        router.push("/setting/privacyAgreement");
    };

    const loginOut = () => {
        router.push("/")
    };



    return (
        <View style={{ height: "100%", backgroundColor: "#fff" }}>
            <Stack.Screen
                options={{
                    title: '取消订单', // 设置屏幕标题
                    headerStyle: {
                        backgroundColor: '#fff', // 设置标题栏的背景颜色
                    },
                    headerShadowVisible: false, // 隐藏底部阴影和边框
                    headerBackTitleVisible: false,
                    headerTintColor: "#333",
                    headerLeft: () => (
                        <TouchableOpacity onPress={() => router.back()}>
                            <AntDesign name="left" size={19} color="#333" />
                            {/*<Ionicons name="arrow-back" size={30} color="#fff" style={{ paddingLeft: 15 }} />*/}
                        </TouchableOpacity>
                    ),
                }}
            />
            <View style={styles.cancelOrderContainer}>
                <Textarea
                    maxLength={50}
                    placeholder={'请输入取消原因'}
                    placeholderTextColor={'#c7c7c7'}
                    underlineColorAndroid={'transparent'}
                    style={ styles.signatureTextInput}
                />
            </View>
           <TouchableOpacity>
               <View style={styles.cancelOrderBtn}>
                   <Text style={styles.cancelOrderBtnText}>确认取消</Text>
               </View>
           </TouchableOpacity>
        </View>

    );
}

const styles = StyleSheet.create({
    signatureTextInput: {
        backgroundColor: "#F7F7F7",
        height: 100,
        padding: 12,
        fontSize: 14,
        color: "#9C9EAC",
        borderRadius: 8,
    },
    cancelOrderContainer: {
        paddingLeft: 12,
        paddingRight: 12,
        marginTop: 8,
    },
    cancelOrderBtn: {
        width: scaleSize(351),
        backgroundColor: "#E4E6EC",
        height: 38,
        marginLeft: 12,
        borderRadius: 19,
        display: "flex",
        justifyContent: "center",
        alignItems: "center",
        marginTop: 191,
    },
    cancelOrderBtnText: {
        color: "#FFFFFF",
        fontSize: 14,
    },
});
